<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>公务员招考</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

    <link href="../../plugins/mui/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="../../css/excutive_housekeeper/statistical_detail.css" />
    <script src="../../js/statistics.js"></script>
    <style>
        #share{
            float: right;
            margin-right: 5%;
            width: auto;
            height: 100%;
            padding: 6px 11px;
        }
        #share img{
            width: 20px;
            padding-top: 40%;
        }
        /*页面溢出隐藏设置*/
       #main{
       	overflow: hidden;
       }
        /*图片显示*/
        #big_img{
            width: 100%;
            height: 100vh;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 999;
            overflow: scroll;
            background: rgba(0,0,0,0.5);
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        #big_img .img_box{
            position: relative;
            width: 100%;
            /*修改备注*/
            /*margin-top:20%;*/
            height:100vh;
            -webkit-user-drag: none;-moz-user-drag: none;-o-user-drag: none;user-drag: none;

        }
        #big_img .img_box img{
            width: 100%;
            -webkit-user-drag: none;-moz-user-drag: none;-o-user-drag: none;user-drag: none;
            /*position: absolute;
            top: 50%;
            transform: translateY(-50%);
            -webkit-transform: translateY(-50%);*/
        }
    </style>
</head>
<body>
<header class="mui-bar mui-bar-nav header">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">公务员招考</h1>
    <span id='share'>
    <img src="../../images/icon/news_list/share.png" alt="" />
    </span>
</header>
<div id="main">
    <!--<h3 class="title_header" style="margin-top:49px;">2010年河东市国民经济和社会发展统计公报</h3>
    <div class="date" style="border-bottom:1px solid #f5f5f5;">
        <span>2011-03-08</span>
        <span>河东统计局</span>
    </div>
    <div class="s_main">

    </div>-->
</div>

<div id="big_img" style="display: none;">
    <div class="img_box">
        <div></div>
    </div>
</div>

<script type="text/javascript" src='../../plugins/jquery/jquery-3.1.0.min.js'></script>
<script src="../../plugins/mui/mui.min.js"></script>
<script src="../../js/getApiToken.js"></script>
<script src="../../js/md5.js"></script>
<script src='../../js/fontset.js'></script>
<script src="../../js/zoom/underscore.js"></script>
<script src="../../js/zoom/pinchzoom.js"></script>
<script src="../../js/executive_housekeeper/civil_detail.js"></script>
<!--<script src="../../js/news_list/share.js"></script>-->
<script>
	mui.init({
        gestureConfig:{
            tap: true, //默认为true
            longtap: true //默认为false
        }
    });
    var scroll;
    var sharehrefDes,
            sharehrefTitle,//微信主要内容
            sharehrefID;//微信所需的链接id
	mui.plusReady(function(){
      	var article_id=plus.webview.currentWebview().detail_id;//列表id
      	sharehrefID=article_id;//ID
        console.log(article_id);
		//数据交互
        myAjax(
            'home/recruit/getCivilDetail','post',{'id':article_id},
            function(data){
               console.log(JSON.stringify(data));
               if(data.success){
	               	var html='';
	               html=
	               		'<h3 class="title_header" style="margin-top:49px;">'+data.title+'</h3>'+
					    '<div class="date" style="border-bottom:1px solid #f5f5f5;">'+
					        '<span>'+data.time+'</span>'+
					        '<span style="padding-left:5px;">'+data.publisher+'</span>'+
					    '</div>'+
					    '<div class="s_main">'+
							data.content
					    +'</div>';
					$('#main').append(html);
                   //标题头、详情
                   sharehrefDes=$('.s_main').text();
                   sharehrefTitle=$('.title_header').text();
                   saveImg();
               }
                
            }
     	);
     	//遍历图片
        function saveImg(){
            $('#main').find('.s_main img').each(function (e) {
                $(this).css({
                    'width': '100%',
                    'height': 'auto'
                });
                $(this).on('tap',function (e) {
                    console.log($(this).attr('src'));
                    var newImg = "<img style='width:100%;height:auto;' src='" + $(this).attr('src') + "'/>";
                    console.log(newImg);
                    $('.img_box div').html(newImg);
                    console.log($('.img_box div').html());

                    //图片显示问题
                    $("#big_img").show();
                    scroll = 0;
                    $('body').on('touchmoe', function (e) {
                        if (scroll == 0) {
                            e.preventDefault();
                            e.stopPropagation();
                        }
                    })

                    $(function () {
                        $(".img_box").each(function () {
                        	console.log('这是什么')
                            new RTP.PinchZoom($(this), {});
                        })

                    })

                })

                $("#big_img").on('tap', function (e) {
                    scroll = 1;
                    $("#big_img").hide();
                    e.preventDefault();
                    e.stopPropagation();
                })
                $(this).on('longtap', function (e) {
//          		console.log($(this).text())
                    console.log($(this).attr("src"));

                    var uploadSrc = $(this).attr("src"),
                            nameArray = uploadSrc.split('/'),
                            name = nameArray[nameArray.length - 1],
                            fileSrc;
                    mui.confirm('是否保存该图片？', '提示', ['确定', '取消'], function (value) {
                        if (value.index == 0) {
                            if (plus.device.name == 'iOS') {
                                fileSrc = '_doc/' + name;
                            } else {
                                fileSrc = '_downloads/image' + name;
                            }
                            var myUpload = plus.downloader.createDownload(uploadSrc, {
                                method: 'get',
                                filename: fileSrc
                            }, function (download, status) {
                                var filename = download.filename;
                                plus.gallery.save(filename, function () {
                                    mui.alert('保存图片成功！');
                                })
                            })
                            myUpload.start();
                        }

                    })
                })

            })
        }
//        函数结束
	})
</script>

</body>
</html>